<template>
	<w-layout showNavbar navTitle="地址管理" :navTitleColor="publicStyles['--color-t1']" background="url('/static/image/bk.png') no-repeat"
		navBackgroundColor="transparent" :scrollTop="page.scrollTop" :navScrollColor="publicStyles['--color-bk']">
		<template #default>
			<view class="container">
				<view @click="chooseAddress(item)" style="min-height: 290rpx;position: relative;" class="public-card-6 fc px-40 pt-40 mt-40" v-for="(item,index) in state.list" :key="index">
					<view class="fr-ac u-border-bottom pb-40" style="border-color: var(--gray-line) !important;">
						<view class="flex-1">
							<view class="">
								{{item.province}}{{item.county}}{{item.city}}{{item.address}}
							</view>
							<view class="fr-ac mt-20">
								<view class="op-50">
									{{item.name}}
								</view>
								<view class="op-50 ml-20">
									{{item.mobile}}
								</view>
								<view v-if="item.is_default" class="fs-24 color px-12 py-4 ml-30" style="background: #1C4B59;">
									默认
								</view>
							</view>
						</view>
					</view>
					<view class="fr-ac my-40 fs-24">
						<!-- <up-icon v-if="true" name="yuanxingxuanzhongfill" customPrefix="custom-icon" size="16"
							:color="publicStyles['--color']"></up-icon>
						<up-icon v-else name="yuanxingweixuanzhong" customPrefix="custom-icon" size="16"
							:color="publicStyles['--gray-9']"></up-icon>
							
						<view class="op-50 ml-15 flex-1">
							设为默认
						</view> -->
						
						<image @click.stop="editAddress(item)" class="ml-auto" style="width: 40rpx;height: 40rpx;" src="/static/icon/public/edit.png" mode=""></image>
						<image @click.stop="get_address_del(item)" class="ml-40" style="width: 40rpx;height: 40rpx;" src="/static/icon/public/delete-2.png" mode=""></image>
					</view>
				</view>
				
				<fixed-bottom>
					<template #default>
						<view class="px-40 w-100 h-100 fr-ac">
							<view @click="$u.route('/pages/address/add')" class="w-100 public-btn-3 transition py-25 t-c">
								<view class="text-color-b fs-32">
									添加地址
								</view>
							</view>
						</view>
					</template>
				</fixed-bottom>
				
			</view>
		</template>
	</w-layout>
</template>

<script setup>
	import {
		getJumpData
	} from '@/common/common'
	import {
		ref,
		reactive,
		onMounted,
		computed,
		nextTick,
		getCurrentInstance
	} from 'vue'
	import {
		storeToRefs
	} from 'pinia'
	import {
		onShow, onPageScroll
	} from '@dcloudio/uni-app'
	import {
		useAppStore
	} from '@/store/app'
	import {
		useColorStore
	} from '@/store/color'
	import {
		address_list,
		address_del
	} from '@/utils/request/api';
	import {
		useUserStore
	} from '@/store/user'
	const userStore = useUserStore()
	const appStore = useAppStore()
	const colorStore = useColorStore()
	const {
		publicStyles
	} = storeToRefs(colorStore)
	const CurrentInstance = getCurrentInstance()
	
	onShow(async(options) => {
		get_address_list()
	})
	onMounted(() => {
		appStore.loadingHandler(false)
	})
	onPageScroll((e)=>{
		page.scrollTop = e.scrollTop
	})
	const page = reactive({
		scrollTop:0
	})
	
	const tabs = reactive({
		current:0,
		list:[
			{
				id:'',
				name:'赏品预览',
			},
			{
				id:'',
				name:'参与人数',
			},
			{
				id:'',
				name:'中奖记录',
			}
		]
	})
	function tabChange(e){
		tabs.current = e.index
		console.log(tabs.current)
	}
	
	const state = reactive({
		list:[],
		page:1,
		limit:15,
		last_limit:15,
		
		keyword:'',
	})
	function initData(){
		state.list = []
		state.page = 1
		state.last_limit = 15
	}
	
	async function get_address_list(){
		const res = await address_list({})
		state.list = res.data
	}
	
	async function get_address_del(item){
		const res = await address_del({id:item.id})
		await get_address_list()
		uni.$u.toast('删除成功')
	}
	
	function editAddress(item){
		uni.navigateTo({
			url: `/pages/address/add`,
			success:function(res){
				res.eventChannel.emit('setAddressInfo', { data: item })
			}
		})
	}
	
	function chooseAddress(item){
		uni.navigateBack({
			delta: 1,
			success: function() {
				getJumpData.apply(CurrentInstance.proxy,['emit','chooseAddress',{
					...item,
					str: [item.province,item.county,item.city].join('')
				}])
			}
		})
	}
</script>

<style lang="scss">
	.shadow {
		box-shadow: 2rpx 2rpx 12rpx var(--shadow);
	}
	.color{
		color: var(--color);
	}

	.container {
		width: 100%;
		min-height: 100%;
		position: relative;
		overflow: hidden;
		box-sizing: border-box;
		padding: 0 30rpx;
		
	}
</style>